import React from 'react';
import { Form, Button, Input } from 'antd';
import { WeekMonthDate } from '@/components/WeekMonthDate';
// import { useProductProjectList } from '../hooks';
import { limitDate } from '../utils';

/* 2020-4-3
注释的代码是产品要求隐藏的产品线和项目组
http://jira.vv.cn:8000/browse/VVDEV-3327
*/
const Search = ({ query, form, onSearch }) => {
    // const [loading, productProject] = useProductProjectList();

    // const [projectOptions, setProjectOptions] = useState([]);
    // console.log(productProject);
    // 处理产品线数据
    // const projectData = {};
    // const productOptions = productProject.map(item => {
    //     projectData[item.id] = item.projectList;
    //     return {
    //         label: item.productName,
    //         value: item.id
    //     };
    // });

    //  提交搜索
    const handleSearch = e => {
        e.preventDefault();
        form.validateFields((err, values) => {
            if (!err) {
                const {
                    productId,
                    projectGroupId,
                    employeeName,
                    date: { reportType, startDate, endDate }
                } = values;
                const payload = {
                    productId,
                    projectGroupId,
                    employeeName,
                    reportType,
                    startDate,
                    endDate
                };
                if (onSearch) {
                    onSearch(payload);
                }
            }
        });
    };

    // 选择产品线联动
    // useEffect(() => {
    //     const pid = form.getFieldValue('productId');
    //     if (pid) {
    //         setProjectOptions(projectData[pid]);
    //     } else {
    //         setProjectOptions([]);
    //     }
    // }, [form.getFieldValue('productId')]);

    return (
        <Form layout="inline" onSubmit={handleSearch}>
            {/* <Form.Item label="产品线">
                {form.getFieldDecorator('productId', { initialValue: Number(query.productId) || undefined })(
                    <Select allowClear style={{ width: 120 }} placeholder="请选择" loading={loading} key="productIdall">
                        {productOptions.map(item => (
                            <Select.Option value={item.value} key={item.value}>
                                {item.label}
                            </Select.Option>
                        ))}
                    </Select>
                )}
            </Form.Item>
            {projectOptions && projectOptions.length > 0 ? (
                <Form.Item>
                    {form.getFieldDecorator('projectGroupId', { initialValue: query.projectGroupId || undefined })(
                        <Select allowClear style={{ width: 120 }} placeholder="请选择" key="projectGroupIdall">
                            {projectOptions.map(item => (
                                <Select.Option value={item.id} key={item.id}>
                                    {item.projectGroupName}
                                </Select.Option>
                            ))}
                        </Select>
                    )}
                </Form.Item>
            ) : null} */}
            <Form.Item>
                {form.getFieldDecorator('date', { initialValue: query.startDate })(
                    <WeekMonthDate
                        reportType={query.reportType}
                        disabledDate={current => limitDate(current, query.reportType)}
                    />
                )}
            </Form.Item>

            <Form.Item label="员工">
                {form.getFieldDecorator('employeeName', {
                    initialValue: query.employeeName || ''
                })(<Input style={{ width: 120 }} placeholder="输入员工"></Input>)}
            </Form.Item>

            <Form.Item>
                <Button type="primary" htmlType="submit">
                    查询
                </Button>
            </Form.Item>
        </Form>
    );
};

const FormSearch = Form.create({ name: 'Search' })(Search);

export default FormSearch;
